<template>
	<view class="container">
		<!-- <u-navbar bgColor="#0065FF" titleStyle="color:#fff;" leftIconColor="#fff" title="竞标详情" autoBack
			placeholder></u-navbar> -->
		<view class="other">
			<view class="title" v-if="xgcs<1">
				<text>项目介绍:</text>
				<text class="baoc" @click="baocun">保存</text>
			</view>
			<!-- {{dataInfo.content}} -->
			<view :v-html="dataInfo.content"></view>
		</view>
		<view class="content">
			<view class="header">
				<!-- <view class="price"> 
					<text>竞标总价：{{ allPrice }}</text>
				</view> -->
				<view class="menu">
					<text>品名</text>
					<text>规格</text>
					<text>单位</text>
					<text>数量</text>
					<text>限价</text>
					<text>竞标价格</text>
				</view>
			</view>
			<view class="list">
				<view class="cg_xzz1" v-for="(item, index) in recordList" :key="index">
					<view class="item">
						<text>{{ item.typeName }}</text>
						<text>{{ item.specName }}</text>
						<text>{{ item.brandName }}</text>
						<text>{{ item.num }}</text>
						<text>{{ item.priceLimit == 0 ? '无' : item.priceLimit }}</text>
						<text>{{ item.money }}</text>
					</view>
					<view class="address">
						<u-input class="inp_k_cd" :data-index="index" fontSize="26rpx" placeholder="产地"
							border="surround" v-model="item.producer"></u-input>
					</view>
				</view>
			</view>

			<view class="price">
				<text class="xianj">限价总价：{{ checkPrice }}</text>
				<text>竞标总价：{{ allPrice }}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				content: '',
				allPrice: 0,
				checkPrice: 0,
				dataInfo: {},
				recordList: [],
				project:{},
				logId:null,
				projectId:null,
				xgcs:0
			};
		},
		filters: {

		},
		onLoad(e) {
			console.log(e)
			// api/project_log/list?project_id= seeProjectLogDetail
			this.logId = e.logId
			this.projectId = e.projectId
			
			this.getRecord()
			// console.log(this.dataInfo);
			// console.log(e.status)
			// this.project = JSON.parse(decodeURIComponent(e.project));
			// console.log(this.project)
			// this.id = e.id
			// this.status = e.status
			// this.content = e.title
			// this.allPrice = e.all_money
			// this.dataInfo.forEach((e, i) => {
			// 	this.checkPrice += Number(e.price)
			// })

			// console.log(e);
			// this.setNavigationBarTitle({ title: '竞标详情' })
		},
		methods: {
			baocun() {
				console.log(this.logId)
				let arr = []
				this.recordList.forEach((item,index)=>{
					arr.push({
						logId:this.logId,
						id:item.id,
						producer:item.producer
					})
				})
				console.log(arr)
				// return
				// var data = this.project
				// data.detail = this.dataInfo
				this.$api.editAddres(arr).then((response) => {
					uni.$u.toast('保存成功.');
					this.getRecord()
				});
			},
			
			async getRecord(id) {
					this.recordList=[]
				this.$api.seeProjectLogDetail({
					logId: this.logId,
					pageNum: 1,
					pageSize: 999
				}).then((response) => {
					this.recordList.push(...response.rows);
					this.xgcs = response.rows[0].xgcs
					// var checkPrice = 
					response.rows.forEach((item,index)=>{
						this.checkPrice = this.checkPrice + (item.priceLimit * item.num)
						this.allPrice = this.allPrice + (item.money * item.num)
					})
				})
				
				this.$api.getProjectInfo({
					id: this.projectId
				}).then((response) => {
					this.dataInfo = response.data;
					console.log(this.dataInfo)
				})
				
			},
		}
	};
</script>

<style lang="scss" scoped>
	.cg_xzz1 {
		.address {
			margin-bottom: 10rpx;
		}
	}

	.status_0 {
		color: #999;
	}

	.status_1 {
		color: #f56c6c;
	}

	.status_2 {
		color: #5ac725;
	}

	.left {
		display: flex;
		color: #fff;
		align-items: center;
		font-size: 24rpx;
	}

	.header {
		position: fixed;
		width: 100%;
		padding: 20rpx;
		background-color: #fff;
		box-sizing: border-box;
		font-size: 24rpx;
		font-weight: bold;

		.menu {
			// margin-top: 20rpx;
			display: flex;

			>text:nth-of-type(1) {
				width: 25%;
				text-align: center;
			}

			>text:nth-of-type(2) {
				width: 18%;
				text-align: center;
			}

			>text:nth-of-type(3) {
				width: 15%;
				text-align: center;
			}

			>text:nth-of-type(4) {
				width: 15%;
				text-align: center;
			}

			>text:nth-of-type(5) {
				width: 12%;
				text-align: center;
			}

			>text:nth-of-type(6) {
				width: 15%;
				text-align: center;
			}
		}
	}

	.other {
		padding: 20rpx;

		.title {
			margin-bottom: 20rpx;
			font-size: 28rpx;
			display: flex;
			justify-content: space-between;

			.baoc {
				background: #2196F3;
				padding: 10rpx;
				border-radius: 10rpx;
				font-size: 28rpx;
				color: #fff;
			}
		}
	}

	.price {
		font-size: 28rpx;
		padding: 20rpx;
		display: flex;
		justify-content: flex-end;
		text-align: right;

		.xianj {
			padding-right: 20rpx;
		}
	}


	.list {
		padding: 60rpx 20rpx;

		.item {
			display: flex;
			font-size: 24rpx;
			padding: 20rpx 0;
			border-bottom: 1rpx dotted #ddd;

			>text:nth-of-type(1) {
				width: 25%;
				text-align: center;
			}

			>text:nth-of-type(2) {
				width: 18%;
				text-align: center;
			}

			>text:nth-of-type(3) {
				width: 15%;
				text-align: center;
			}

			>text:nth-of-type(4) {
				width: 15%;
				text-align: center;
			}

			>text:nth-of-type(5) {
				width: 12%;
				text-align: center;
			}

			>text:nth-of-type(6) {
				width: 15%;
				text-align: center;
			}
		}
	}
</style>